<template>
  <div id="right">
    <div class="template-attr-title">
      属性
    </div>
    <div class="template-attr-name">
      {{ attrDataInfo.formData.title }}
    </div>
    <div class="template-attr-body" v-show="attrDataInfo.showArea==='main'">
      <resolution></resolution>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Background'">
      <back-groud></back-groud>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Main'">
      <anchor-area></anchor-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Mixed'">
      <video-area></video-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='ImageText'">
      <image-text></image-text>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Web'">
      <web-area></web-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Scroll'">
      <scroll-area></scroll-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Audio'">
      <audio-area></audio-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Weather'">
      <weather-area></weather-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Clock'">
      <clock-area></clock-area>
    </div>
    
    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Timer'">
      <timer-area></timer-area>
    </div>

    <div class="template-attr-body" v-show="attrDataInfo.showArea==='Extension'">
      <extension-area></extension-area>
    </div>

  </div>
</template>
<script>
// 选择模板
import Resolution from "./TemplateForm/Resolution"
// 背景区
import BackGroud from "./TemplateForm/BackGroud"
// 主播区
import AnchorArea from "./TemplateForm/AnchorArea"
// 综合区
import VideoArea from "./TemplateForm/VideoArea"
// 图文区
import ImageText from "./TemplateForm/ImageText"
// 网页区
import WebArea from "./TemplateForm/WebArea"
// 滚动条
import ScrollArea from "./TemplateForm/ScrollArea"
// 音频区
import AudioArea from "./TemplateForm/AudioArea"
// 天气区
import WeatherArea from "./TemplateForm/WeatherArea"
// 时钟区
import ClockArea from "./TemplateForm/ClockArea"
// 计时区
import TimerArea from "./TemplateForm/TimerArea"
// 扩展区
import ExtensionArea from "./TemplateForm/ExtensionArea"

export default {
  data() {
    return {
      
    }
  },
  methods: {
  },
  inject: ['attrDataInfo'],
  components: {
    Resolution,
    BackGroud,
    AnchorArea,
    VideoArea,
    ImageText,
    WebArea,
    ScrollArea,
    AudioArea,
    WeatherArea,
    ClockArea,
    TimerArea,
    ExtensionArea
  },
}
</script>